<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>登录</title>
	<style type="text/css">
		.box{
			width: 300px;
			height: 400px;
			margin: 50px auto 0;
			background-color: antiquewhite;
		}
		input{
			outline: none;
		}
		.h3{
			line-height: 100px;
		}
		#re{
			margin: 10px 0;
		}
		#dl{
			width: 174px;
			height: 26px;
			border-radius: 8px;
			border: none;
			background-color: #00FFFF;
		}
		#zhuce{
			margin-right: 50px;
		}
	</style>
</head>
<body>
	<div class="box">
		<div id="particles-js" class="dia"></div>
		<form action="登录页面.html" method="get" align="center" onsubmit="return false">
			<h3 class="h3">登录</h3>
			<p class="p">
				账号：
				<input name="username" id="username">
				<span>*</span>
				<br>
				<span id="tishiUsername"></span>
			</p>
			<p>
				密码：<input type="password" name="password" id="pwd">
				<span>*</span>
				<br>
				<span id="tishiPwd"></span>
			</p>
			<div id="re">
				<input type="checkbox" id="jzmm" />
				<span id="span">
					记住密码
				</span>
			</div>
			<button type="submit" id="dl" value="登录" onclick="checkUser()">登录</button>
			<br><br>
			<button type="button" id="zhuce" onclick="add()">注册</button>
			<button type="button">忘记密码</button>
		</form>
	</div>
	<script>
		function checkUser(){
			var username = document.getElementById("username").value;//文本框中的值，var是各种变量类型的集合
			if(username == ""){
				document.getElementById("tishiUsername").innerHTML ="用户名不能为空";
				tishiUsername.style.color="red";
				return;//必须要写return跳出
			}else{
				document.getElementById("tishiUsername").innerHTML ="";
			}
			
			var pwd = document.getElementById("pwd").value;
			if(pwd == ""){
				document.getElementById("tishiPwd").innerHTML ="密码不能为空";
				tishiPwd.style.color="red";
				return;
			}else{
				document.getElementById("tishiPwd").innerHTML ="";
				var reg = /^[0-9]{6}$/;
				if(!reg.test(pwd)){
					document.getElementById("tishiPwd").innerHTML ="密码只能为6位数字";
					tishiPwd.style.color="red";
					return;
				}
			}
			window.location.href="列表页面.html";//全部通过则定位至链接
		}
		function add(){
			location.href = "注册页面.html";
		}
	</script>
		
</body>
</html>